<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<%
	String path = request.getContextPath();
%>
<title>系统管理</title>
<link rel="stylesheet" type="text/css"
	href="<%=path%>/css/btn_class.css" />
<link rel="stylesheet" type="text/css"
	href="<%=path%>/extjs/resources/css/ext-all.css" />
<link rel="stylesheet" type="text/css"
	href="<%=path%>/extjs/style.css" />
<link rel="stylesheet" type="text/css"
	href="<%=path%>/extjs/ext-patch.css" />

<script type="text/javascript"
	src="<%=path%>/extjs/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="<%=path%>/extjs/ext-all.js"></script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
<body>
	<div id="west-div" style="width: 100%; height: 100%;"></div>
	<div id="center-div"></div>
</body>
<script type="text/javascript">
	Ext.BLANK_IMAGE_URL = "<%=path%>/extjs/resources/images/default/s.gif";

	Ext.onReady(function() {
				Ext.QuickTips.init();

			/************************************* 部门树  开始 ********************************************************/	
				// shorthand
				var Tree = Ext.tree;

				var loader = new Tree.TreeLoader({
					dataUrl : 'office!buildOfficeTree.do'
					//dataUrl : 'sys_tree.jsp'
				});
				loader.on("beforeload", function(treeLoader, node) {
				//	loader.baseParams.ftype  = node.attributes.ftype;
				//	loader.baseParams.fcode  = node.attributes.fcode;
			    }, this);

				loader.processResponse = function(response, node, callback) {
					var json  = response.responseText;
					
					try {
						var json = eval( "(" + json + ")" );
						
						node.beginUpdate();
						//从json中取得json数组
						var o = json["key"];
						
						for(var i = 0, len = o.length; i < len; i++) {
							var n = this.createNode(o[i]);
							if(n) {
								
								node.appendChild(n);
							}
						}
						node.endUpdate();
						if(typeof callback == "function") {
							callback(this, node);
						}
					}catch(e) {
						this.handleFailure(response);
					}
				};
				
				var tree = new Tree.TreePanel({
					region : 'west',
					id : 'west-panel',
					el : 'west-div',
					width : 240,
					title : '所属部门',
					useArrows : true,
					autoScroll : true,
					animate : true,
					enableDD : true,
					containerScroll : true,
					rootVisible : true,
					loader : loader
				});
				
				//单击事件
				tree.on(
						'click',
						function(node) {
							Ext.get("dept_parent").dom.value = node.id;
							Ext.get("dept_parentName").dom.value = node.text;
							ds.on('beforeload',function(){        // =======翻页时 查询条件
               					ds.baseParams={
									node : node.id
               					}
            				});
							ds.load({
								params : {
									start : 0,
									limit : 50
								}
							});
						}, tree);

				// set the root node
				var root = new Tree.AsyncTreeNode({
					text : '所有部门',
					draggable : false,
					id : '-1'
					
				});
				tree.setRootNode(root);
				tree.render();
				root.expand();

	/************************************* 部门树 结束 ********************************************************/			
				
			///////////////////////////////////  列表开始  ///////////////////////////////////////////////////////
			
				var Jthtwb = Ext.data.Record.create([ {
					name : 'deptId',
					mapping : 'deptId',
					type : 'string'
				}, {
					name : 'deptName',
					mapping : 'deptName',
					type : 'string'
				}, {
					name : 'deptLName',
					mapping : 'deptLName',
					type : 'string'
				}, {
					name : 'deptLPhone',
					mapping : 'deptLPhone',
					type : 'string'
				}, {
					name : 'deptLTel',
					mapping : 'deptLTel',
					type : 'string'
				}, {
					name : 'deptAdd',
					mapping : 'deptAdd',
					type : 'string'
				}, {
					name : 'parent',
					mapping : 'parent',
					type : 'string'
				}, {
					name : 'deptType',
					mapping : 'deptType',
					type : 'string'
				}, {
					name : 'leaf',
					mapping : 'leaf',
					type : 'string'
				}, {
					name : 'deptNamePYM',
					mapping : 'deptNamePYM',
					type : 'string'
				}, {
					name : 'parentName',
					mapping : 'parentName',
					type : 'string'
				}  ]);

				
				//部门表单
				function dept_detail_form() {
					if(Ext.get("dept_parent").dom.value == null || Ext.get("dept_parent").dom.value == "null" || Ext.get("dept_parent").dom.value == "") {
						alert("请在左侧所属部门一栏选择上级部门！");
						return false;
					}
					var dept_form_send = new Ext.FormPanel(
							{
								layout : "form",  
								url : 'dept!addDept.do',
								method : 'POST',
								labelWidth : 75,
						        waitMsgTarget: true,  
						        bodyStyle : 'padding-left:15px;',
								resizeTabs : true,
								frame : true,
								items : [{
									xtype : 'textfield',
									fieldLabel : '上级部门',
									id : 'parentName_form',
									name : 'parentName',
									readOnly : true,
									allowBlank : true,
									value : Ext.get("dept_parentName").dom.value,
									width : 230
								},{
									xtype : 'hidden',
									fieldLabel : '上级部门id',
									id : 'parent_form',
									name : 'parent',
									readOnly : true,
									allowBlank : true,
									value : Ext.get("dept_parent").dom.value,
									width : 230
								},{
									xtype : 'textfield',
									fieldLabel : '部门名称',
									id : 'deptName_form',
									name : 'deptName',
									readOnly : false,
									allowBlank : false,
									emptyText : '请填写部门名称',
									blankText : '请填写部门名称',
									width : 230
								},{
									xtype : 'textfield',
									fieldLabel : '联系人',
									id : 'deptLName_form',
									name : 'deptLName',
									readOnly : false,
									allowBlank : true,
									width : 130
								},{
									xtype : 'numberfield',
									fieldLabel : '联系人手机',
									id : 'deptLPhone_form',
									name : 'deptLPhone',
									readOnly : false,
									allowBlank : true,
									width : 130
								},{
									xtype : 'textfield',
									fieldLabel : '联系人电话',
									id : 'deptLTel_form',
									name : 'deptLTel',
									readOnly : false,
									allowBlank : true,
									width : 230
								},{
									xtype : 'textarea',
									fieldLabel : '部门地址',
									id : 'deptAdd_form',
									name : 'deptAdd',
									readOnly : false,
									allowBlank : true,
									width : 230
								},{
									xtype : 'hidden',
									fieldLabel : 'deptId',
									id : 'deptId_form',
									name : 'deptId'
								},{
									xtype : 'hidden',
									fieldLabel : '叶子',
									id : 'leaf_form',
									name : 'leaf'
								
					}
						]});
						
					var btn_save_form = new Ext.Button({
						text : '保存',
						iconCls : 'sy-save',
						handler : function(btn) {
							
							var frm = dept_form_send.getForm();
							if (frm.isValid()) {

								frm.submit({
									url : 'dept!addDept.do',
									method : 'POST',
									waitTitle : '请稍候',
									waitMsg : '正在提交表单数据,请稍候...',
									success : function(form, action) {
											ds.reload();
											dept_detail_window.close();
											
									},
									failure : function(form, action) {
										Ext.Msg.show({
											title : '错误提示',
											msg : action.result.message,
											buttons : Ext.Msg.OK,
											fn : function() {
												unfield.focus(true);
												btn.enable();
											},
											icon : Ext.Msg.ERROR
										});
									},// failure
									icon : Ext.Msg.ERROR
								});
							}
							;// isValid
						}
					});
					
					var btn_reset_form = new Ext.Button({
						text : '取消',
						iconCls : 'sy-reset',
						handler : function(btn) {
							dept_detail_window.close();
						}

					});

					var dept_detail_window = new Ext.Window({
						tbar : [ btn_save_form, '-', btn_reset_form],
						width : 380,
						height : 270,
						title : '部门管理',
						iconCls : 'sy-win-flag',
						modal : true,
						items : [ dept_form_send ]
					});
					dept_detail_window.show();
				    
				} // end form
				
				
				
				//机构表单
				
				var ds = new Ext.data.Store({
					reader : new Ext.data.JsonReader({
						totalProperty : 'totalProperty',
						root : 'root'
					}, Jthtwb),
					idProperty : 'threadid',
					remoteSort : true,
					url : 'dept!findDepts.do'

				});
				
				//定义勾选框，不需要可不必定义
				var sm = new Ext.grid.CheckboxSelectionModel({
					singleSelect : true //单选
				});

				//定义列
				var colM = new Ext.grid.ColumnModel([ sm, new Ext.grid.RowNumberer(),//增加自动编号，不需要可不必定义
				// {header:'序号',dataIndex:'id',width:40,sortable:true}, // 生成列，sortable为列排序，不需要设置为false，默认false，renderer为该列增加自定义函数
				{
					header : '部门名称',
					dataIndex : 'deptName',
					width : 240,
					sortable : true
				},{
					header : '联系人',
					dataIndex : 'deptLName',
					width : 100,
					renderer : function(value) {
						if (value == "null") {
							return "";
						} else {
							return value;
						}
					},
					sortable : true
				},{
					header : '联系人手机号码',
					dataIndex : 'deptLPhone',
					width : 150,
					renderer : function(value) {
						if (value == "null") {
							return "";
						} else {
							return value;
						}
					},
					sortable : true
				},{
					header : '联系人办公电话',
					dataIndex : 'deptLTel',
					width : 150,
					renderer : function(value) {
						if (value == "null") {
							return "";
						} else {
							return value;
						}
					},
					sortable : true
				},{
					header : '详细地址',
					dataIndex : 'deptAdd',
					width : 300,
					renderer : function(value) {
						if (value == "null") {
							return "";
						} else {
							return value;
						}
					},
					sortable : true
				}]);
				
				var btn_add = new Ext.Button({
					text : '新增',
					iconCls : 'sy-add',
					handler : function() {
						dept_detail_form();
						
					}
				});
				
				var btn_mod = new Ext.Button({
					text : '修改',
					iconCls : 'sy-sure',
					handler : function() {
						var record = grid.getSelectionModel().getSelected();
						if (record) {
							dept_detail_form();
							Ext.get("deptName_form").dom.value = record.data.deptName;
							Ext.get("deptId_form").dom.value = record.data.deptId;
							
							if(record.data.deptLName == null || record.data.deptLName == "null") {
								Ext.get("deptLName_form").dom.value = "";
							} else {
								Ext.get("deptLName_form").dom.value = record.data.deptLName;
							}
							
							if(record.data.deptLPhone == null || record.data.deptLPhone == "null") {
								Ext.get("deptLPhone_form").dom.value = "";
							} else {
								Ext.get("deptLPhone_form").dom.value = record.data.deptLPhone;
							}
							
							if(record.data.deptLTel == null || record.data.deptLTel == "null") {
								Ext.get("deptLTel_form").dom.value = "";
							} else {
								Ext.get("deptLTel_form").dom.value = record.data.deptLTel;
							}
							
							if(record.data.deptAdd == null || record.data.deptAdd == "null") {
								Ext.get("deptAdd_form").dom.value = "";
							} else {
								Ext.get("deptAdd_form").dom.value = record.data.deptAdd;
							}
							
						}
					}
				});
				
				var btn_delete = new Ext.Button({
					text : '删除',
					iconCls : 'sy-delete',
					handler : function() {
						
						var record = grid.getSelectionModel().getSelected();
						if (record) {
							
							Ext.Msg.confirm('确认删除', '删除部门将导致该部门下的员工不可用，您确定删除吗？', function(btn) {
								if (btn == 'yes') {
									Ext.Ajax.request({
										url : 'dept!deleteDept.do?deptId=' + record.data.deptId,
										success : function() {
											ds.reload();
										//	Ext.MessageBox.alert('提示', '删除机构成功！');
										},
										failure : function() {
											Ext.Msg.show({
												title : '错误提示',
												msg : '删除部门失败！',
												buttons : Ext.Msg.OK,
												icon : Ext.Msg.ERROR
											});
										}
									});
								}
							});

						} else {
							Ext.MessageBox.alert('提示', '请选择一行纪录进行操作！');
							return;
						}
					}
				});
				
				

				//生成表格
				var grid = new Ext.grid.GridPanel( {
					closable : false,
					region : 'center',
					height : 550,
					id : 'maingrid',
				//	cls : 'empty',
				//	contentEl : 'center-div',
					autoWidth : true,
					cm : colM,
					ds : ds,
					sm : sm,
					//	stripeRows : true,
					//	loadMask : true, //遮罩
					enableHdMenu : false,
					tbar:[btn_add, '-', btn_mod, '-', btn_delete,{
							xtype : 'hidden',
							fieldLabel : '上级机构名称',
							id : 'dept_parentName',
							name : 'dept_parentName'
						},{
							xtype : 'hidden',
							fieldLabel : '上级机构id',
							id : 'dept_parent',
							name : 'dept_parent'
					}],
					title:'机构列表',
					bbar : new Ext.PagingToolbar( {
						pageSize : 30,
						store : ds,
						displayInfo : true,
						displayMsg : '显示 {0} 条到 {1} 条记录，一共 {2} 条',
						emptyMsg : "没有记录"
					})
				});
				
				///////////////////////////////////  列表结束  ///////////////////////////////////////////////////////
				
				var viewport = new Ext.Viewport({
					layout : 'border',
					items : [ tree, grid ]
				});
			});
</script>


</html>